<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>分页</title>
    <link rel="stylesheet" href="../../res/layui/css/layui.css">
    <script src="../../res/layui/layui.js"></script>
</head>
<body>

<!--内容-->
<div>
    <div id="myPage"></div>
</div>

<!--脚本-->
<script>

    function getPageData() {
        return {
            "count": 100
        };
    }


    layui.use("laypage", function (laypage) {
        // 获取数据
        var pageData = getPageData();

        // 渲染表格
        laypage.render({
            elem: "myPage",
            count: pageData.count, // 数据总数
            limits: [10, 20, 30], // 单页条数
            layout: ['count', 'prev', 'page', 'next', 'limit', 'skip', 'refresh'],
            hash: 'pageNo',
            curr: location.hash.replace('#!pageNo=', ''),
            jump: function (obj, first) { // 切换分页时触发

                // obj 包含了当前分页的所有参数，比如：
                console.log("页码：", obj.curr, " 页大小：", obj.limit);

                // first 用于标识是否首次触发，一般用于初始化加载的判断
                if (first) {
                    console.log("首次触发 jump ...")
                } else {
                    // do something ...
                }

            }
        });

    });

</script>


</body>
</html>